<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/modules/cms/front/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
	<title>${category.name}</title>
	<meta name="decorator" content="cms_default_${site.theme}"/>
	<meta name="description" content="${category.description}" />
	<meta name="keywords" content="${category.keywords}" />
	<style>
		.container{
			width:100%;
		}
		.advantage{
			width:100%;
			height:653px;
		}
		.advantage .row{
			width:1200px;
			height:100%;
			position:relative;
			margin:0 auto;
		}
		.advantage .row .title{
			position:relative;
		}
		.advantage .row .title .outter{
			position:absolute;
			left:-17px;
			top:160px;
		}
		.advantage .row .title .inner{
			position:absolute;
			left:-36px;
			top:137px;
		}
		.advantage .row .title .item1{
			text-align:left;
			width:30px;
			line-height:30px;
			color:#fff;
			position:absolute;
			left:90px;
			top:295px;
			font-size:30px;
		}
		.advantage .row .title .english{
			display:block;
			position:absolute;
			left:25px;
			top:222px;
			writing-mode: vertical-rl;
			height:200px;
		}
		.advantage .row .bgImg{
			width:660px;
			height:400px;
			position:absolute;
			left:67px;
			top:105px;
			z-index:-1;
		}
		.advantage .row .article{
			position:absolute;
			width:534px;
			height:306px;
			left:662px;
			top:156px;
			font-size:16px;
			word-wrap:break-word;
		}

		/*优选生活*/
		.life{
			width:100%;
			height:720px;
			background: transparent url(http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgnqGVyQUoqOiRwQQwgA840AU.jpg) no-repeat top;
		}
		.life .row{
			width:1200px;
			height:100%;
			color:#fff;
			position:relative;
			margin:0 auto;
		}
		.life .row .title{
			width:447px;
			height:108px;
			position:absolute;
			left:376px;
			top:91px;
		}
		.life .row .title h2{
			font-size:50px;
			font-family: 微软雅黑,"microsoft yahei";
			text-align: center;
			margin-bottom:20px;
		}
		.life .row .title p{
			text-align: center;
		}
		.life .row .content{
			width:100%;
			height:374px;
			display:flex;
			justify-content: space-between;
			align-items: center;
			position:absolute;
			left:8px;
			top:241px;
		}
		.life .row .content .smallImg{
			position:relative;
		}
		.life .row .content .travel{
			width:285px;
			height:100%;
		}
		.row .content .travel a{
			color:#fff;
		}
		.row .content .travel a:hover{
			color:#fff;
		}
		.row .content .travel .smallTitle{
			position:absolute;
			left:18px;
			top:145px;
			font-size:16px;
		}
		.row .content .travel .introduce{
			position:absolute;
			left:18px;
			top:180px;
			width:260px;
		}
		.life .row .content .youxuan{
			width:285px;
			height:100%;
		}
		.row .content .youxuan .smallTitle{
			position:absolute;
			left:18px;
			top:347px;
			font-size:16px;
		}
		.row .content .youxuan .introduce{
			position:absolute;
			left:18px;
			top:10px;
			width:260px;
		}
		.life .row .content .photovoltaic{
			width:285px;
			height:100%;
		}
		.row .content .photovoltaic .smallTitle{
			position:absolute;
			left:18px;
			top:145px;
			font-size:16px;
		}
		.row .content .photovoltaic .introduce{
			position:absolute;
			left:18px;
			top:180px;
			width:260px;
		}
		.life .row .content .jingshui{
			width:285px;
			height:100%;
		}
		.row .content .jingshui .smallTitle{
			position:absolute;
			left:18px;
			top:347px;
			font-size:16px;
		}
		.row .content .jingshui .introduce{
			position:absolute;
			left:18px;
			top:10px;
			width:260px;
		}

		/*乐农服务*/
		.service{
			width:100%;
			height:720px;
			background: transparent url(http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgnqGVyQUoqOiRwQQwgA840AU.jpg) no-repeat top;
		}
		.service .row{
			width:1200px;
			height:100%;
			color:#fff;
			position:relative;
			margin:0 auto;
		}
		.service .row .title{
			width:447px;
			height:108px;
			position:absolute;
			left:376px;
			top:91px;
		}
		.service .row .title h2{
			font-size:50px;
			font-family: 微软雅黑,"microsoft yahei";
			text-align: center;
			margin-bottom:20px;
		}
		.service .row .title p{
			text-align: center;
		}
		.service .row .content{
			width:100%;
			height:374px;
			display:flex;
			justify-content: space-between;
			align-items: center;
			position:absolute;
			left:8px;
			top:241px;
		}
		.service .row .content .smallImg{
			position:relative;
		}
		.service .row .content .laowu{
			width:285px;
			height:100%;
		}
		.row .content .laowu .smallTitle{
			position:absolute;
			left:18px;
			top:145px;
			font-size:16px;
		}
		.row .content .laowu .introduce{
			position:absolute;
			left:18px;
			top:180px;
			width:260px;
		}
		.service .row .content .peixun{
			width:285px;
			height:100%;
		}
		.row .content .peixun .smallTitle{
			position:absolute;
			left:18px;
			top:347px;
			font-size:16px;
		}
		.row .content .peixun .introduce{
			position:absolute;
			left:18px;
			top:10px;
			width:260px;
		}
		.service .row .content .falv{
			width:285px;
			height:100%;
		}
		.row .content .falv .smallTitle{
			position:absolute;
			left:18px;
			top:145px;
			font-size:16px;
		}
		.row .content .falv .introduce{
			position:absolute;
			left:18px;
			top:180px;
			width:260px;
		}

		/*乐农生态*/
		.zoology{
			width:100%;
			height:720px;
			background: transparent url(http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgnqGVyQUoqOiRwQQwgA840AU.jpg) no-repeat top;
		}
		.zoology .row{
			width:1200px;
			height:100%;
			color:#fff;
			position:relative;
			margin:0 auto;
		}
		.zoology .row .title{
			width:447px;
			height:108px;
			position:absolute;
			left:376px;
			top:91px;
		}
		.zoology .row .title h2{
			font-size:50px;
			font-family: 微软雅黑,"microsoft yahei";
			text-align: center;
			margin-bottom:20px;
		}
		.zoology .row .title p{
			text-align: center;
		}
		.zoology .row .content{
			width:100%;
			height:374px;
			display:flex;
			justify-content: space-between;
			align-items: center;
			position:absolute;
			left:8px;
			top:241px;
		}
		.zoology .row .content a{
			color:#fff;
		}
		.zoology .row .content .smallImg{
			position:relative;
		}
		.zoology .row .content .shangxia{
			width:285px;
			height:100%;
		}
		.row .content .shangxia .smallTitle{
			position:absolute;
			left:18px;
			top:145px;
			font-size:16px;
		}
		.row .content .shangxia .introduce{
			position:absolute;
			left:18px;
			top:180px;
			width:260px;
		}
		.zoology .row .content .goods{
			width:285px;
			height:100%;
		}
		.row .content .goods .smallTitle{
			position:absolute;
			left:18px;
			top:347px;
			font-size:16px;
		}
		.row .content .goods .introduce{
			position:absolute;
			left:18px;
			top:10px;
			width:260px;
		}
		.zoology .row .content .fangan{
			width:285px;
			height:100%;
		}
		.row .content .fangan .smallTitle{
			position:absolute;
			left:18px;
			top:145px;
			font-size:16px;
		}
		.row .content .fangan .introduce{
			position:absolute;
			left:18px;
			top:180px;
			width:260px;
		}
		.zoology .row .content .line{
			width:285px;
			height:100%;
		}
		.row .content .line .smallTitle{
			position:absolute;
			left:18px;
			top:347px;
			font-size:16px;
		}
		.row .content .line .introduce{
			position:absolute;
			left:18px;
			top:10px;
			width:260px;
		}
	</style>
</head>
<body>

<c:forEach items="${categoryList}" var="category">
	<c:if test="${category.module=='article'}" >
		<div class="advantage">
			<div class="row">
				<div class="title">
					<img src="http://13869797.s61i.faiusr.com/4/AD0I5cXOBhAEGAAgxZqVyQUoyI7JuQMwvgE4ogI.png" class="outter"/>
					<img src="http://13869797.s61i.faiusr.com/4/AD0I5cXOBhAEGAAg1JyVyQUomIC3ETCWAThk.png" class="inner"/>
					<span class="item1">${category.name}</span>
					<span class="english">LENONG</span>
				</div>
				<div class="span6 pull-left bgImg">
					<img src="http://13869797.s61i.faiusr.com/4/AD0I5cXOBhAEGAAgiZyVyQUo-s2ILjCUBTiQAw.png"/>
				</div>
				<div class="pull-right article">
					<p>${category.description}</p>
				</div>
			</div>
		</div>
		</c:if>
	<c:if test="${category.module==''}" >
		<div class="zoology">
			<div class="row">
				<div class="title">
					<h2>${category.name}</h2>
					<p>——————&nbsp;&nbsp;&nbsp;LENONG&nbsp;&nbsp;&nbsp;——————</p>
				</div>
					<%--${fnc:getCategoryList(1,category.id,4 ,null)}--%>
				<c:set var="categorys" value="${fnc:getCategoryList(1,category.id,4 ,null)}"/>
				<div class="content">

					<div class="shangxia">
						<a href="list-${categorys[0].id}.html">
						<div class="smallImg">
							<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAg2KSVyQUo_IiYmgYwnQI49gI.jpg"/>
							<p class="smallTitle">${categorys[0].name}</p>
							<p class="introduce">
									${categorys[0].description}
							</p>
						</div>
						</a>
					</div>
					<%--<a href="list-3383714797eb456eb41da0bafe99af47.html">--%>
					<div class="goods">
						<a href="list-${categorys[1].id}.html">
						<div class="smallImg">
							<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgk6WVyQUo0OjPsAMwnQI49gI.jpg"/>
							<p class="smallTitle">${categorys[1].name}</p>
							<p class="introduce">${categorys[1].description}</p>
						</div>
						</a>
					</div>

					<div class="fangan">
						<a href="list-${categorys[2].id}.html">
						<div class="smallImg">
							<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgp6WVyQUo7sG-1AYwnQI49gI.jpg"/>
							<p class="smallTitle">${categorys[2].name}</p>
							<p class="introduce">${categorys[2].description}</p>
						</div>
						</a>
					</div>

				</div>
			</div>
		</div>
	</c:if>

</c:forEach>



<%--乐农生态--%>
<%--<div class="zoology">
	<div class="row">
		<div class="title">
			<h2>${categoryList[1].name}</h2>
			<p>——————&nbsp;&nbsp;&nbsp;LENONG ZOOLOGY&nbsp;&nbsp;&nbsp;——————</p>
		</div>
		<div class="content">
			<div class="shangxia">
				<div class="smallImg">
					<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAg2KSVyQUo_IiYmgYwnQI49gI.jpg"/>
					<p class="smallTitle">商品+服务${categoryList[1].childList[0].name}</p>
					<p class="introduce">商品+服务商品+服务商品+服务商品+服务商品+服务商品+服务商品+服务商品+服务商品+服务

					</p>
				</div>
			</div>
			<div class="goods">
				<div class="smallImg">
					<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgk6WVyQUo0OjPsAMwnQI49gI.jpg"/>
					<p class="smallTitle">线上+线下</p>
					<p class="introduce">线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下</p>
				</div>
			</div>
			<div class="fangan">
				<div class="smallImg">
					<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgp6WVyQUo7sG-1AYwnQI49gI.jpg"/>
					<p class="smallTitle">上行+下行</p>
					<p class="introduce">上行+下行上行+下行上行+下行上行+下行上行+下行上行+下行上行+下行上行+下行上行+下行</p>
				</div>
			</div>
			&lt;%&ndash;<div class="line">&ndash;%&gt;
				&lt;%&ndash;<div class="smallImg">&ndash;%&gt;
					&lt;%&ndash;<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgnaWVyQUogbW4kQcwnQI49gI.jpg"/>&ndash;%&gt;
					&lt;%&ndash;<p class="smallTitle">线上+线下</p>&ndash;%&gt;
					&lt;%&ndash;<p class="introduce">线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下线上+线下</p>&ndash;%&gt;
				&lt;%&ndash;</div>&ndash;%&gt;
			&lt;%&ndash;</div>&ndash;%&gt;
		</div>
	</div>
</div>

&lt;%&ndash;优选生活&ndash;%&gt;

<div class="life">
	<div class="row">
		<div class="title">
			<h2>${categoryList[2].name}</h2>
			<p>——————&nbsp;&nbsp;&nbsp;EXCELLENT LIFE&nbsp;&nbsp;&nbsp;——————</p>
		</div>
		<div class="content">
			<div class="travel">
				<a href="list-3383714797eb456eb41da0bafe99af47.html">
					<div class="smallImg">
						<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAg2KSVyQUo_IiYmgYwnQI49gI.jpg"/>
						<p class="smallTitle">乐农优选购</p>
						<p class="introduce">乐农优选购乐农优选购乐农优选购乐农优选购乐农优选购乐农优选购乐农优选购乐农优选购乐农优选购</p>
					</div>
				</a>
			</div>
			<div class="youxuan">
				<div class="smallImg">
					<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgk6WVyQUo0OjPsAMwnQI49gI.jpg"/>
					<p class="smallTitle">乐农旅游</p>
					<p class="introduce">乐农旅游乐农旅游乐农旅游乐农旅游乐农旅游乐农旅游乐农旅游乐农旅游乐农旅游乐农旅游乐农旅游</p>
				</div>
			</div>
			<div class="photovoltaic">
				<div class="smallImg">
					<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgp6WVyQUo7sG-1AYwnQI49gI.jpg"/>
					<p class="smallTitle">低碳生活</p>
					<p class="introduce">低碳生活低碳生活低碳生活低碳生活低碳生活低碳生活低碳生活低碳生活低碳生活低碳生活低碳生活</p>
				</div>
			</div>
			&lt;%&ndash;<div class="jingshui">&ndash;%&gt;
				&lt;%&ndash;<div class="smallImg">&ndash;%&gt;
					&lt;%&ndash;<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgnaWVyQUogbW4kQcwnQI49gI.jpg"/>&ndash;%&gt;
					&lt;%&ndash;<p class="smallTitle">净水设备</p>&ndash;%&gt;
					&lt;%&ndash;<p class="introduce">净水设备净水设备净水设备净水设备净水设备净水设备净水设备净水设备净水设备净水设备净水设备</p>&ndash;%&gt;
				&lt;%&ndash;</div>&ndash;%&gt;
			&lt;%&ndash;</div>&ndash;%&gt;
		</div>
	</div>
</div>

&lt;%&ndash;乐农服务&ndash;%&gt;
<div class="service">
	<div class="row">
		<div class="title">
			<h2>${categoryList[3].name}</h2>
			<p>——————&nbsp;&nbsp;&nbsp;LENONG SERVICE&nbsp;&nbsp;&nbsp;——————</p>
		</div>
		<div class="content">
			<div class="laowu">
				<div class="smallImg">
					<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAg2KSVyQUo_IiYmgYwnQI49gI.jpg"/>
					<p class="smallTitle">职业培训</p>
					<p class="introduce">职业培训职业培训职业培训职业培训职业培训职业培训职业培训职业培训职业培训职业培训职业培训</p>
				</div>
			</div>
			<div class="peixun">
				<div class="smallImg">
					<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgk6WVyQUo0OjPsAMwnQI49gI.jpg"/>
					<p class="smallTitle">劳务输出</p>
					<p class="introduce">劳务输出劳务输出劳务输出劳务输出劳务输出劳务输出劳务输出劳务输出劳务输出劳务输出劳务输出</p>
				</div>
			</div>
			<div class="falv">
				<div class="smallImg">
					<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgp6WVyQUo7sG-1AYwnQI49gI.jpg"/>
					<p class="smallTitle">法律援助</p>
					<p class="introduce">法律援助法律援助法律援助法律援助法律援助法律援助法律援助法律援助法律援助法律援助法律援助</p>
				</div>
			</div>
			&lt;%&ndash;<div class="falv">&ndash;%&gt;
			&lt;%&ndash;<div class="smallImg">&ndash;%&gt;
			&lt;%&ndash;<img src="http://13869797.s61i.faiusr.com/2/AD0I5cXOBhACGAAgnaWVyQUogbW4kQcwnQI49gI.jpg"/>&ndash;%&gt;
			&lt;%&ndash;<p class="smallTitle">净水设备</p>&ndash;%&gt;
			&lt;%&ndash;<p class="introduce">净水设备净水设备净水设备净水设备净水设备净水设备净水设备净水设备净水设备净水设备净水设备</p>&ndash;%&gt;
			&lt;%&ndash;</div>&ndash;%&gt;
			&lt;%&ndash;</div>&ndash;%&gt;
		</div>
	</div>
</div>--%>
</body>
</html>